<template>
	<view class="content">
		<view class="list" v-if="dataList.length">
			<view class="list-item" v-for="(item,index) in dataList" :key="index">
				<view class="user u-flex">
					<u--image :src="item.user.avatar" shape="circle" width="44rpx" height="44rpx">
					</u--image>
					<text>{{item.user.nickname}}</text>
				</view>
				<view class="title">
					{{item.content}}
				</view>
				<view class="images u-flex">
					<view class="iamges-item" v-for="(zitem,zindex) in item.images" :key="zindex">
						<!-- <view class="new-tip">
							更新
						</view> -->
						<u--image :src="zitem.fullurl" radius="16rpx" width="136rpx" height="136rpx">
						</u--image>
					</view>
				</view>
				<!-- <view class="file-box u-flex" @click="fuBtn(item.files.url)">
					<u-icon name="attach" color="#4871C0" size="24"></u-icon>
					<text>{{item.files.filename}}</text>
				</view> -->
				<view class="step-box">
         <!-- <u-steps current="1" direction="column">
            <view class="" v-for="(sitem,sindex) in item.check" :key="sindex">
              <u-steps-item :title="sitem.status_name=='驳回'?'不通过':sitem.status_name" :nickname="sitem.nickname">
                <text v-if="sitem.status == 1" class="slot-icon" slot="icon">
                  <u-icon name="checkmark-circle" color="#4871C0" size="20"></u-icon>
                </text>
                <text v-if="sitem.status == 0" class="slot-icon" slot="icon">
                  <u-icon name="close-circle" color="#FF7A00" size="20"></u-icon>
                </text>
              </u-steps-item>
              <view class="reject">
                {{sitem.content}}
              </view>
            </view>
          </u-steps> -->
				</view>
				<!-- <view class="buttons u-flex" v-if="item.is_check == 1">
					<view class="button-box button1" @click="rejectTopicFun(item.id)">
						驳回
					</view>
					<view class="button-box button2" @click="adoptTopicFun(item.id)">
						通过
					</view>
				</view> -->
			</view>
		</view>
		<!-- 加载更多 -->
		<u-loadmore v-if="dataList.length" :status="loadStatus" />

		<u-empty v-if="!dataList.length && !isLoading" mode="data" icon="http://cdn.uviewui.com/uview/empty/car.png">
		</u-empty>

		<!-- 驳回弹窗 -->
		<u-modal :show="show" @confirm="confirm" @cancel="cancel" ref="uModal" title="驳回理由" confirmText="确定"
			:showCancelButton="true">
			<view class="slot-content reason-content">
				<u--textarea v-model="reason" height="100" placeholder="请驳回理由~" border="surround" confirmType="done">
				</u--textarea>
			</view>
		</u-modal>
	</view>
</template>

<script>
	import {
		getTopicList,
		operationTopic,
		operationTopic2,
		recordList,
	} from '@/api/meetApi.js'
	export default {
		data() {
			return {
				id: '',
				page: 1,
				limit: 12,
				lastPage: 0,
				loadStatus: '',
				dataList: [],
				show: false,
				reason: '',
				chooseId: ''
			}
		},
		onLoad(options) {
			this.id = options.id;
			this.getData();
		},
		onShow() {

		},
		onLoad(options) {
			this.id = options.id;
			this.getData();
		},
		methods: {
			// 获取数据
			getData() {
				this.loadStatus = 'loading';
				this.isLoading = true;
				let params = {
					page: this.page,
					limit: this.limit,
					meet_id: this.id
				};
				recordList(params).then(res => {
					if (res.code == 1) {
						this.isLoading = false;
						uni.stopPullDownRefresh();
						this.lastPage = res.data.last_page
						this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
						this.dataList = [...this.dataList, ...res.data.data]
					} else {
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 3500
						});
					}

				})
			},
			// 点击附件预览
			fuBtn(url) {
				uni.openDocument({
					filePath: url,
					showMenu: true,
					success: function(res) {}
				});
			},
			// 取消
			cancel() {
				this.show = false;
				reason: ''
			},
			// 驳回
			rejectTopicFun(id) {
				this.show = true;
				this.chooseId = id;
			},
			// 驳回
			confirm() {
				this.isLoading = true;
				let params = {
					topic_id: this.chooseId,
					status: 0,
					content:this.reason
				};
				operationTopic(params).then(res => {
					this.isLoading = false;
					console.log(res)
					this.show = false;
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					});
          this.dataList=[]
          this.getData()
				})
			},
			// 通过
			adoptTopicFun(id) {
				this.isLoading = true;
				let params = {
					topic_id: id,
					status: 1,
				};
				operationTopic(params).then(res => {
					this.isLoading = false;
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 1000
					});
          this.dataList=[]
          this.getData()
				})

			}
		}
	}
</script>

<style>
	.content {
		background-color: #F8F8F8;
		min-height: 100vh;
	}

	.u-flex {
		display: flex;
		align-items: center;
	}

	.list {
		padding: 20rpx 30rpx;
	}

	.list-item {
		background: #FFFFFF;
		border-radius: 16rpx;
		opacity: 1;
		padding: 30rpx;
		margin-bottom: 20rpx;
	}

	.user text {
		font-size: 28rpx;
		font-weight: bold;
		color: #333333;
		margin-left: 10rpx;
	}

	.title {
		margin-top: 20rpx;
		font-size: 28rpx;
		font-weight: 500;
		color: #333333;
		line-height: 52rpx;
	}

	.images {
		margin-top: 20rpx;
		margin-bottom: 10rpx;
	}

	.iamges-item {
		margin-right: 40rpx;
		position: relative;
	}

	.file-box {
		position: relative;
		margin: 20rpx 0;
		padding: 20rpx;
		background: #F8F9FC;
		border-radius: 16rpx;
		opacity: 1;
		font-size: 28rpx;
		font-weight: 500;
		color: #4871C0;
	}

	.button-box {
		width: 128rpx;
		height: 64rpx;
		line-height: 64rpx;
		text-align: center;
		border-radius: 16rpx;
		opacity: 1;
		font-size: 28rpx;
		font-weight: 500;
		margin-top: 20rpx;
	}

	.button1 {
		color: #4871C0;
		border: 1px solid #4871C0;
		margin-left: auto;
	}

	.button2 {
		color: #FFFFFF;
		background: #4871C0;
		margin-left: 20rpx;
	}

	.new-tip {
		position: absolute;
		top: 0;
		right: 0;
		width: 56rpx;
		height: 32rpx;
		line-height: 32rpx;
		background: #FF7A00;
		border-radius: 0px 16rpx 0px 10rpx;
		opacity: 1;
		font-size: 18rpx;
		color: #fff;
		z-index: 22;
		text-align: center;
	}

	.reject {
		padding-left: 126rpx;
		font-size: 28rpx;
		font-weight: 500;
		color: #666666;
		line-height: 52rpx;
	}

	.reason-content {
		width: 100%;
		border-radius: 8rpx;
		opacity: 1;
	}

	/deep/ .u-modal__content {
		text-align: center !important;
	}

	/deep/.u-textarea {
		background: #F8F8F8;
		border-radius: 8rpx;
		opacity: 1;
		text-align: left;
	}

	/deep/.uni-textarea-placeholder {
		text-align: left;
		font-size: 28rpx;
		font-weight: 500;
		color: #999999;
	}
</style>
